<!-- 答题授权页 -->
<template>
    <page-view-top-nav :element="element" />
    <div class="question-authorization-wrap">
        <img :src="customFeature.style['background-image']" class="background-mark" />

        <div class="content-wrap">
            <div class="form-wrap">
                <div class="form-item">
                    <div class="form-item-label">真实姓名</div>
                    <div class="form-item-content">请输入您的姓名</div>
                </div>
                <div class="form-item">
                    <div class="form-item-label">电话号码</div>
                    <div class="form-item-content">请输入您的电话号码</div>
                </div>
                <div class="form-item">
                    <div class="form-item-label">党组织名称</div>
                    <div class="form-item-content">请选择您所属单位</div>
                </div>
            </div>
            <div class="submit-btn" :style="[customFeature.submitButton.style]">提交</div>

            <div>
                <div v-for="(item, index) in customFeature.promptList" :key="index">
                    {{ item }}
                </div>
            </div>
        </div>
    </div>
</template>

<script>
import { defineComponent, toRefs, computed } from 'vue'
import PageViewTopNav from '../../page-view-top-nav'
export default defineComponent({
    name: 'QuestionAuthorization',
    components: {
        PageViewTopNav
    },
    props: {
        element: {
            type: Object,
            default: () => ({})
        }
    },
    setup(props) {
        const { element } = toRefs(props)

        const customFeature = computed(() => element.value?.customFeature || {})

        return {
            element,
            customFeature
        }
    }
})
</script>

<style lang="less" scoped>
@import './question-authorization.less';
</style>